let vm = new Vue({
	el: '#app',
    delimiters: ['[[', ']]'],
	data: {
		mobile: '',
		password: '',
		code_img: '',
		code_sms: '',

		error_mobile: false,
		error_password: false,
		error_code_img: false,
		error_code_sms: false,

		error_mobile_message: '',
		error_code_img_msg: '',
		error_code_sms_msg: '',

		img_count: 0,
		code_img_url: '',
		send_sms: '获取短信验证码',
		send_flag: true,
	},
	mounted(){
		// 生成图形验证码
		let uuid = generateUUID();
		this.code_img_url = '/codeImg/' + uuid + '/';
	},
	methods: {
		// 生成图形验证码
		get_code_img() {
                //通过修改图片链接自动获取
                this.img_count += 1;
                // console.log(this.code_img_url+this.img_count.toString());
            },
		// 检查手机号
		check_mobile(){
			let re = /^1[3-9]\d{9}$/;
			if(re.test(this.mobile)) {
				this.error_mobile = false;
			} else {
				this.error_mobile_message = '手机号必须是11位的有效号码';
				this.error_mobile = true;
			}
		},
		// 检查密码
		check_password(){
			let re = /^[0-9A-Za-z]{8,20}$/;
			if (re.test(this.password)) {
				this.error_password = false;
			} else {
				this.error_password = true;
			}
		},
		// 检查图片验证码
		check_code_img(){
                if(!this.code_img) {
                    this.error_code_img= true;
                    this.error_code_img_msg = '请填写图形验证码';
                }else{
                    this.error_code_img= false;
                }
        },
		// 检查短信验证码
		check_code_sms(){
                if(!this.code_sms) {
                    this.error_code_sms= true;
                    this.error_code_sms_msg = '请填写短信验证码';
                }else{
                    this.error_code_sms= false;
                }
        },
		// 发送短信验证码
		get_code_sms(){
                if(!this.send_flag){
                    //已发送 send_flag=false 发送功能关闭
                    return;
                }

                // 检查图片验证码和手机号是否有误
                    // 由于字段初始值为空且无误，故需先将空字段设为有误。
                if(!this.mobile){
                    this.error_mobile_message = '手机号不能为空';
                    this.error_mobile = true;
                }
                if(!this.code_img){
                    this.error_code_img_msg = '请填写图形验证码';
                    this.error_code_img= true;
                }
                    // 此时空字段已设为有误，非空字段也已通过检查，便可以直接检查所有字段是否有误了
                if(this.error_mobile || this.error_code_img)
                {
                    this.get_code_img(); //输入有误，更新图片验证码
                    return;
                }else

                // 发送请求
                this.send_flag = false; //短信即将发送，关闭发送功能，禁止重复发送
                let url = '/codeSMS/'+ this.code_img_url.slice(9) + this.code_img + '/' + this.mobile;
                axios.get(url, {'ReponseType': 'json'})
                    .then(response => {
                        switch(response.data.code){
                            case 200:   //短信发送成功
                                this.error_code_sms = true;
                                this.error_code_sms_msg = response.data.errmsg;
                                // 展示倒计时60秒效果
                                let time = 60;
                                let t = setInterval(() => {
                                    if (time) {
                                        // 正在倒计时
                                        time -= 1;
                                        this.send_sms = '已发送' + time + '秒';
                                    }
                                    else {
                                        // 倒计时结束
                                        clearInterval(t); // 停止回调函数的执行
                                        this.send_sms = '重新发送短信验证码'; // 可再次获取短信验证码
                                        this.get_code_img(); // 重新生成图形验证码
                                        this.send_flag = true; // 开启短信发送功能
                                    }
                                }, 1000);
                                break;
                            case 401:   //图片验证码错误
                                this.error_code_img = true;
                                this.error_code_img_msg = response.data.errmsg;
                                this.send_flag = true; // 开启短信发送功能
                                break;
                            case 402:   //短信发送失败
                                this.error_code_sms = true;
                                this.error_code_sms_msg = response.data.errmsg;
                                this.send_flag = true; // 开启短信发送功能
                                break;
                        }

                    })
                    .catch(error => {
                                console.log(error.response);
                            })
            },
		// 绑定openid
		on_submit(){
			this.check_mobile();
			this.check_password();
			this.check_code_sms();

			if (this.error_mobile || this.error_password || this.error_code_sms) {
                    window.event.returnValue = false;
                }
		}
	}
});